@use "sass:map";

@use "../../theme.scss" as *;
// {bem_b,bem_e,bem_m,VueAndNvueStyleAttr,when,$namespace}
@use "./mixin/mixins.scss" as *;
@use './mixin/function.scss' as *;
// // {set-component-css-var}
@use "./mixin/_var.scss" as *;
// // { $form，$input-font-size}
@use "./common/var.scss" as *;

@import "common/index.scss";


@include bem_b(form-item) {
  @include flex(column);
  
  @include bem_e(body) {
    display: flex;
    @include VueAndNvueStyleAttr("padding","form-item", "padding");
    &__left {
      @include flex;
      align-items: center;

      &__content {
        position: relative;
        @include flex;
        align-items: center;
        padding-right: 10rpx;
        flex: 1;

        &__icon {
          margin-right: 8rpx;
		  @include VueAndNvueStyleAttr("color","text-color", "primary");
        }

        &__required {
          @include VueAndNvueStyleAttr("color","text-color", "error");
          line-height: 20px;
          font-size: 20px;
		  margin-right: 2px
        }

        &__label {
          @include flex;
          align-items: center;
          flex: 1;
          @include VueAndNvueStyleAttr("color","text-color", "primary");
          font-size: 15px;
        }
      }
    }
    &__right {
      flex: 1;
      &__content {
        @include flex;
        align-items: center;
        flex: 1;

        &__slot {
          flex: 1;
          /* #ifndef MP */
          @include flex;
          align-items: center;
          /* #endif */
        }

        &__icon {
          margin-left: 10rpx;
          color: $e-light-color;
          font-size: 30rpx;
        }
      }
    }
  }
  @include bem_e(error) {
    font-size: 12px;
    line-height: 12px;
    @include VueAndNvueStyleAttr("color","text-color", "error");
  }
}
